<template>
	<view>
		<cu-custom bgImage="https://image.weilanwl.com/color2.0/plugin/cjkz2329.jpg" isBack="true"><block slot="content">登录授权</block></cu-custom>
		<view class="zai-box">
			<image src="../../static/zaizai-login/login.png" mode="aspectFit" class="zai-logo"></image>
			<view class="zai-title">LOGO区域</view>
			<view style="color: red;text-align: center;margin-top: 100rpx;font-size: 36rpx;">
				<view class="padding-xs">您正在执行后台登录操作</view>
				<view class="padding-xs">操作IP: {{ IP }}</view>
			</view>
			<button class="cu-btn bg-gradual-blue btns margin-top" @tap="loginAdmin">确认登录</button>
			<button class="cu-btn bg-gradual-blue btns margin-top-xl" @tap="cancel">取消操作</button>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
import { getCode, loginAdmin, cancellogin } from '@/api/adminlogin.js';
export default {
	data() {
		return {
			codeId: '',
			IP: ''
		};
	},
	async onLoad(e) {
		if (e && e.codeId) {
			try {
				var res = await getCode({ codeId: e.codeId });
				this.IP = res.IP;
				this.codeId = e.codeId;
			} catch (err) {
				return this.$refs.uToast.show({
					title: err,
					type: 'error',
					position: 'top',
					url: '/pages/index/index'
				});
			}
		}
	},
	methods: {
		async loginAdmin() {
			if (!this.codeId) {
				return;
			}
			try {
				await loginAdmin({ codeId: this.codeId });
				return this.$refs.uToast.show({
					title: '后台登录成功',
					type: 'success',
					position: 'top',
					url: '/pages/index/index'
				});
			} catch (err) {
				return this.$refs.uToast.show({
					title: err,
					type: 'error',
					position: 'top'
				});
			}
		},
		async cancel() {
			if (!this.codeId) {
				return;
			}
			try {
				await cancellogin({ codeId: this.codeId });
				return this.$refs.uToast.show({
					title: '取消成功',
					type: 'success',
					position: 'top',
					url: '/pages/index/index'
				});
			} catch (err) {
				return this.$refs.uToast.show({
					title: err,
					type: 'error',
					position: 'top'
				});
			}
		}
	}
};
</script>

<style lang="scss">
.zai-box {
	margin-top: 150rpx;
	padding: 0 100rpx;
	position: relative;
}
.zai-logo {
	width: 100%;
	width: 100%;
	height: 310rpx;
}
.zai-title {
	position: absolute;
	top: 0;
	line-height: 360rpx;
	font-size: 68rpx;
	color: #fff;
	text-align: center;
	width: 100%;
	margin-left: -100rpx;
}
.btns {
	width: 100%;
	height: 80rpx;
	border-radius: 100rpx;
	font-size: 36rpx;
}
.margin-top {
	margin-top: 300rpx;
}
</style>
